<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
	<!DOCTYPE html>
	<html xmlns="http://www.w3.org/1999/xhtml">
	
		<head>
			<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
			<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
	
			<title>商品详情页面 - ${vo.productName }--${vo.productId }</title>
			
			<jsp:include page="/head.jsp"/>
	
			<link href="front/AmazeUI-2.4.2/assets/css/admin.css" rel="stylesheet" type="text/css" />
			<link href="front/AmazeUI-2.4.2/assets/css/amazeui.css" rel="stylesheet" type="text/css" />
			<link href="front/basic/css/demo.css" rel="stylesheet" type="text/css" />
			<link type="text/css" href="front/css/optstyle.css" rel="stylesheet" />
			<link type="text/css" href="front/css/style.css" rel="stylesheet" />
			<link rel="stylesheet" href="front/css/index.css" type="text/css" />
	
			<script type="text/javascript" src="front/basic/js/jquery-1.7.min.js"></script>
			<script type="text/javascript" src="front/basic/js/quick_links.js"></script>
	
			<script type="text/javascript" src="front/AmazeUI-2.4.2/assets/js/amazeui.js"></script>
			<script type="text/javascript" src="front/js/jquery.imagezoom.min.js"></script>
			<script type="text/javascript" src="front/js/jquery.flexslider.js"></script>
			<script type="text/javascript" src="front/js/list.js"></script>
	
		</head>
	
		<body>
	
	
			<!--顶部导航条 -->
			<div class="hmtop">
			<div class="am-container header">
				<ul class="message-l">
					<div class="topMessage">
						<div class="menu-hd">
							<a href="login1.jsp" target="_top" class="h">你好，请登录</a>
							<a href="register.jsp" target="_top" style="color: #F03726;">免费注册</a>
						</div>
					</div>
				</ul>
				<ul class="message-r">
					<div class="topMessage home">
						<div class="menu-hd"><a href="mall-list.let" target="_top" class="h">商城首页</a></div>
					</div>
					<div class="topMessage my-shangcheng">
						<div class="menu-hd MyShangcheng"><a href="login1.jsp" target="_top"><i class="am-icon-user am-icon-fw" style="color: #F03726;"></i>个人中心</a></div>
					</div>
					<div class="topMessage mini-cart">
						<div class="menu-hd"><a id="mc-menu-hd" href="login1.jsp" target="_top"><i class="am-icon-shopping-cart  am-icon-fw"></i><span>购物车</span><strong id="J_MiniCartNum" class="h">0</strong></a></div>
					</div>
					<div class="topMessage favorite">
						<div class="menu-hd"><a href="login1.jsp" target="_top"><i class="am-icon-heart am-icon-fw"></i><span>收藏夹</span></a></div>
				</ul>
				</div>

				<!--悬浮搜索框-->

				<div class="nav white">
					<div class="logoBig">
						<a href="mall-list.let">
						<li><img src="front/images/logobig.png" alt="图片加载中" style="width: 80px; height: 80px; padding-top: 5px;" /><img src="front/images/logo_font.png" alt="图片加载中" style="width: 88px; height: 35px; display: inline-block;"/></li>
						</a>
					</div>

					<div class="search-bar pr" style="position: absolute;width: 960px;">
						<a name="index_none_header_sysc" href="#"></a>
						<form action="search.let" method="get">
							<input id="searchInput" name="key" type="text" placeholder="请输入关键字" autocomplete="off" value="${search.key }">
							<input id="ai-topsearch" class="submit am-btn" value="搜索" index="1" type="submit">
						</form>
					</div>
				</div>

				<div class="clear"></div>
			</div>
				<b class="line"></b>
				<div class="listMain">
	
					<!--分类-->
				<div class="nav-table">
					<div class="long-title"><span class="all-goods">全部分类</span></div>
					<div class="nav-cont">
					<a href="mall-cart.let">
						 <div class="nav-extra">
							 <i class="am-icon-user-secret am-icon-md nav-user"></i><b></b>购物车 
							 <i class="am-icon-angle-right" style="padding-left: 10px;"></i>
						 </div>
						 </a>
					 </div>	
				</div>
					<ol class="am-breadcrumb am-breadcrumb-slash">
						<li><a href="#">首页</a></li>
						<li><a href="#">分类</a></li>
						<li class="am-active">内容</li>
					</ol>
					<script type="text/javascript">
						$(function() {});
						$(window).load(function() {
							$('.flexslider').flexslider({
								animation: "slide",
								start: function(slider) {
									$('body').removeClass('loading');
								}
							});
						});
					</script>
					
					<!--放大镜-->
	
					<div class="item-inform">
						<div class="clearfixLeft" id="clearcontent">
	
							<div class="box">
								<script type="text/javascript">
									$(document).ready(function() {
										$(".jqzoom").imagezoom();
										$("#thumblist li a").click(function() {
											$(this).parents("li").addClass("tb-selected").siblings().removeClass("tb-selected");
											$(".jqzoom").attr('src', $(this).find("img").attr("mid"));
											$(".jqzoom").attr('rel', $(this).find("img").attr("big"));
										});
									});
								</script>
	
								<div class="tb-booth tb-pic tb-s310">
									<a href="${vo.productImgs}"><img src="${vo.productImgs}" /></a>
								</div>
							</div>
	
							<div class="clear"></div>
						</div>
	
						<div class="clearfixRight">
	
							<!--规格属性-->
							<!--名称-->
							<div class="tb-detail-hd">
								<h1>	
					${vo.productName}
				  </h1>
							</div>
							<div class="tb-detail-list">
								<!--价格-->
								<div class="tb-detail-price">
									<li class="price iteminfo_price">
										<dt>促销价</dt>
										<dd><em>¥</em><b class="sys_item_price">${vo.productPrice2}</b>  </dd>                                 
									</li>
									<li class="price iteminfo_mktprice">
										<dt>原价</dt>
										<dd><em>¥</em><b class="sys_item_mktprice">${vo.productPrice1}</b></dd>									
									</li>
									<div class="clear"></div>
								</div>
	
								<div class="clear"></div>
	
								<!--销量-->
								<ul class="tm-ind-panel">
									<li class="tm-ind-item tm-ind-sellCount canClick">
										<div class="tm-indcon"><span class="tm-label">月销量</span><span class="tm-count">1015</span></div>
									</li>
									<li class="tm-ind-item tm-ind-sumCount canClick">
										<div class="tm-indcon"><span class="tm-label">累计销量</span><span class="tm-count">6015</span></div>
									</li>
									<li class="tm-ind-item tm-ind-reviewCount canClick tm-line3">
										<div class="tm-indcon"><span class="tm-label">累计评价</span><span class="tm-count">640</span></div>
									</li>
								</ul>
								<div class="clear"></div>
	
								<!--各种规格-->
								<dl class="iteminfo_parameter sys_item_specpara">
									<dt class="theme-login"><div class="cart-title">可选规格<span class="am-icon-angle-right"></span></div></dt>
									<dd>
										<!--操作页面-->
	
										<div class="theme-popover-mask"></div>
	
										<div class="theme-popover">
											<div class="theme-span"></div>
											<div class="theme-poptit">
												<a href="javascript:;" title="关闭" class="close">×</a>
											</div>
											<div class="theme-popbod dform">
												<form class="theme-signin" name="loginform" action="" method="post">
	
													<div class="theme-signin-left">
														<div class="theme-options">
															<div class="cart-title number">数量</div>
															<dd>
																<input id="min" class="am-btn am-btn-default" name="" type="button" value="-" />
																<input id="text_box" name="" type="text" value="1" style="width:30px;" />
																<input id="add" class="am-btn am-btn-default" name="" type="button" value="+" />
																<span id="Stock" class="tb-hidden">库存<span class="stock">${vo.productNum}</span>件</span>
															</dd>
	
														</div>
														<div class="clear"></div>
	
													</div>
	
												</form>
											</div>
										</div>
	
									</dd>
								</dl>
								<div class="clear"></div>
							</div>
	
							<div class="pay">
								<div class="pay-opt">
								<a href="home.html"><span class="am-icon-home am-icon-fw">首页</span></a>
								<a><span class="am-icon-heart am-icon-fw">收藏</span></a>
								
								</div>
								<li>
								<form style="display: inline;" method="post" action="mall/cart/pay-start.jsp">
							<input type="hidden" name="productId" value="${vo.productId }">
							<input type="hidden" name="cartNum" value="1"> <input
								type="hidden" name="count"
								value="${t.formatNumber(vo.productPrice2,2) }">
							<div class="clearfix tb-btn tb-btn-buy theme-login">
								<button class="btn btn-danger" title="点此按钮到下一步确认购买信息" >立即购买</button>
							</div>
						</form>
					</li>
								<li>
									<div class="clearfix tb-btn tb-btn-basket theme-login">
										<button class="btn btn-danger" id="addCart" title="加入购物车"  data-id="${vo.productId}"><i></i>加入购物车</button>
									</div>
								</li>
							</div>
<script type="text/javascript">
		var addCart = $("#addCart");
		
		addCart.click(function(){
			console.info(addCart.attr("data-id"));
			$.post(
				"mall-cart.let?action=add&productId="+addCart.attr("data-id"),
				function(data){
					if(data.code==200){
						sys.toastr.success("添加到购物车成功！");
					}else if(data.code==401){
						sys.toastr.error("请先登录");
						window.setTimeout(function(){
							window.location="login1.jsp";
						},2000);
					}else{
						sys.toastr.error(data.message);
					}
				},"json"
			);
		});
</script>
	
						</div>
	
						<div class="clear"></div>
	
					</div>
	
					<div class="clear"></div>
					
								
					<!-- introduce-->
	
					<div class="introduce">
						<div class="introduceMain">
							<div class="am-tabs" data-am-tabs>
								<ul class="am-avg-sm-3 am-tabs-nav am-nav am-nav-tabs">
									<li class="am-active">
										<a href="#">
											<span class="index-needs-dt-txt">宝贝详情</span></a>
									</li>
								</ul>
	
								<div class="am-tabs-bd">
	
									<div class="am-tab-panel am-fade am-in am-active">
										<div class="J_Brand">
	
											<div class="attr-list-hd tm-clear">
												<h4>产品参数：</h4></div>
											<div class="clear"></div>
											${vo.productContent}
											<div class="clear"></div>
										</div>
	
										<div class="clear"></div>
	
									</div>
	
								</div>
	
							</div>
	
							<div class="clear"></div>
	
							<div class="footer ">
						<div class="footer-hd ">
							<p>
								<a href="about.let?name=1278551338296279040 ">舒心购</a>
								<b>|</b>
								<a href="mall-list.let">商城首页</a>
							</p>
						</div>
						<div class="footer-bd ">
							<p>
								<a href="about.let?name=1278551338296279040 ">关于舒心购</a>
								<b>|</b>
								<a href="join.let?name=1278551338526965760 ">联系我们</a>
								<b>|</b>
								<em>© 2020-2025 shuxingou.com 版权所有</em>
							</p>
						</div>
					</div>
						</div>
	
					</div>
				</div>
				<!--菜单 -->
				<div class=tip>
					<div id="sidebar">
						<div id="wrap">
							<div id="prof" class="item ">
								<a href="# ">
									<span class="setting "></span>
								</a>
								<div class="ibar_login_box status_login ">
									<div class="avatar_box ">
										<p class="avatar_imgbox "><img src="front/images/no-img_mid_.jpg " /></p>
										<ul class="user_info ">
											<li>用户名sl1903</li>
											<li>级&nbsp;别普通会员</li>
										</ul>
									</div>
									<div class="login_btnbox ">
										<a href="# " class="login_order ">我的订单</a>
										<a href="# " class="login_favorite ">我的收藏</a>
									</div>
									<i class="icon_arrow_white "></i>
								</div>
		
							</div>
							<div id="shopCart " class="item ">
								<a href="# ">
									<span class="message "></span>
								</a>
								<p>
									购物车
								</p>
								<p class="cart_num ">0</p>
							</div>
							<div id="foot " class="item ">
								<a href="# ">
									<span class="zuji "></span>
								</a>
								<div class="mp_tooltip ">
									我的足迹
									<i class="icon_arrow_right_black "></i>
								</div>
							</div>
		
							<div id="brand " class="item ">
								<a href="#">
									<span class="wdsc "><img src="front/images/wdsc.png " /></span>
								</a>
								<div class="mp_tooltip ">
									我的收藏
									<i class="icon_arrow_right_black "></i>
								</div>
							</div>
							<div class="quick_toggle ">
								<li class="qtitem ">
									<a href="# "><span class="kfzx "></span></a>
									<div class="mp_tooltip ">客服中心<i class="icon_arrow_right_black "></i></div>
								</li>
								<li class="qtitem ">
									<a href="#top " class="return_top "><span class="top "></span></a>
								</li>
							</div>
		
							<!--回到顶部 -->
							<div id="quick_links_pop " class="quick_links_pop hide "></div>
		
						</div>
		
					</div>
	
					</div>
					<div id="prof-content" class="nav-content">
						<div class="nav-con-close">
							<i class="am-icon-angle-right am-icon-fw"></i>
						</div>
						<div>
							我
						</div>
					</div>
					<div id="shopCart-content" class="nav-content">
						<div class="nav-con-close">
							<i class="am-icon-angle-right am-icon-fw"></i>
						</div>
						<div>
							购物车
						</div>
					</div>
					<div id="asset-content" class="nav-content">
						<div class="nav-con-close">
							<i class="am-icon-angle-right am-icon-fw"></i>
						</div>
						<div>
							资产
						</div>
	
						<div class="ia-head-list">
							<a href="#" target="_blank" class="pl">
								<div class="num">0</div>
								<div class="text">优惠券</div>
							</a>
							<a href="#" target="_blank" class="pl">
								<div class="num">0</div>
								<div class="text">红包</div>
							</a>
							<a href="#" target="_blank" class="pl money">
								<div class="num">￥0</div>
								<div class="text">余额</div>
							</a>
						</div>
	
					</div>
					<div id="foot-content" class="nav-content">
						<div class="nav-con-close">
							<i class="am-icon-angle-right am-icon-fw"></i>
						</div>
						<div>
							足迹
						</div>
					</div>
					<div id="brand-content" class="nav-content">
						<div class="nav-con-close">
							<i class="am-icon-angle-right am-icon-fw"></i>
						</div>
						<div>
							收藏
						</div>
					</div>
					<div id="broadcast-content" class="nav-content">
						<div class="nav-con-close">
							<i class="am-icon-angle-right am-icon-fw"></i>
						</div>
						<div>
							充值
						</div>
					</div>
				</div>
	
		</body>
	
	</html>